<template>
  <div class="app-container">
    <div class="filter-container">
      <el-button  @click="handleBackupButton()">返回</el-button>
      <el-button  @click="getAssetList()">搜索</el-button>
    </div>
    <el-table
      :key="tableKey"
      v-loading="listLoading"
      :data="list"
      border
      fit
      highlight-current-row
      style="width: 100%;"
    >
    <el-table-column
     label="编号"
      type="selection"
      width="50">
    </el-table-column>
      <el-table-column label="编码">
        <template slot-scope="{row}">
          <div>{{ row.assetCode }}</div>
        </template>
      </el-table-column>
      <el-table-column label="合约" width="150px">
        <template slot-scope="{row}">
          <span>{{ row.symbol }}</span>
        </template>
      </el-table-column>
      <el-table-column label="资产类型" width="150px">
        <template slot-scope="{row}">
          <el-tag v-if="row.assetStatus == 1" type="danger" effect="dark">期货</el-tag>
          <el-tag v-else-if="row.assetStatus == 2" type="warning" effect="dark">股票</el-tag>
          <el-tag v-else-if="row.assetStatus == 3" type="info" effect="dark">期货期权</el-tag>
          <el-tag v-else-if="row.assetStatus == 4" effect="dark">股票期权</el-tag>
          <el-tag v-else effect="dark">未定义</el-tag>
        </template>
      </el-table-column>
      <el-table-column label="资金" width="200px">
        <template slot-scope="{row}">
          <div>投资额：￥{{ row.investmentAmount }}</div>
          <div>头寸：￥{{ row.position }}</div>
          <div>利润：￥{{ row.profit }}</div>
        </template>
      </el-table-column>
      <el-table-column label="加入时间" width="150px">
        <template slot-scope="{row}">
          <span>{{ row.joinDate }}</span>
        </template>
      </el-table-column>
      <el-table-column label="状态" width="150px">
        <template slot-scope="{row}">
          <el-tag v-if="row.assetStatus == 1" type="danger" effect="dark">立项</el-tag>
          <el-tag v-else-if="row.assetStatus == 2" type="warning" effect="dark">待处理</el-tag>
          <el-tag v-else-if="row.assetStatus == 3" type="info" effect="dark">运行中</el-tag>
          <el-tag v-else-if="row.assetStatus == 4" effect="dark">已结项</el-tag>
          <el-tag v-else effect="dark">未定义</el-tag>
        </template>
      </el-table-column>
    </el-table>

    <pagination v-show="total>0" :total="total" :page.sync="filterForm.page" :limit.sync="filterForm.size" @pagination="getAssetList" />

  </div>
</template>

<script>

import waves from '@/directive/waves' // waves directive
import Pagination from '@/components/Pagination' // secondary package based on el-pagination

import {getCapitalDetail} from '@/api/finance/capital'
import {getAssetList} from '@/api/finance/asset'

export default {
  name: 'faultinessAdmin',
  components: { Pagination },
  directives: { waves },
  filters: {
  },
  data() {
    return {
      tableKey: 0,
      list: null,
      total: 0,
      listLoading: false,
      projectForm:{
      },
      filterForm: {
        page: 1,
        size: 10,
        projectID:0
      }
    }
  },
  created() {
    let projectID = this.$route.query.projectID 
    this.filterForm.projectID = projectID
    this.getAssetList()
  },
  
  watch:{
    'projectForm.firstIndustryID'(industryID){
      this.subIndustryOptions = []
      this.allowedRefreshSubIndustry = true
      this.queryIndustryByIndustryID(industryID)
    }
  },
  methods: {
    getAssetList:function(){
      let _this = this;
      console.log(_this.filterForm)
      getAssetList(_this.filterForm).then((response) => {
        console.log(response)
          if (response.code === 200) {
            this.list = response.data.list
            this.total = response.data.total
          } else {
            _this.$message({
              message: response.msg,
              type: 'error'
            })
          }
      })
    },
    handleBackupButton:function(){
      this.$router.push({ path: 'capital'})
    },
    handleUpdate:function(projectData){
      this.openSubscribeHidden = true
      this.projectForm = projectData
      this.projectForm['projectID'] = this.projectForm.ID
    },
    handleFilter() {
      this.filterForm.page = 1
      this.getList()
    }
  }
}
</script>
<style>

</style>